<template>
    <view>
		<!-- 后续研究虚拟列表，当前这样性能不行 -->
        <jp-virtual-list code="id" class="h100" :refresher="false" isBackTop :data="commentList" ref="search">
           <view v-for="item in commentList">
           	<view class="comment-chat-bg uni-flex uni-row uni-padding-warp uni-common-mt" style="position: relative;">
           		<text style="font-weight: bold; color: gray; font-size: 26rpx;">{{item.username}}</text>
           		<text style="color: gray; font-size: 26rpx;">（{{item.time}}）</text>
           		<text style="color: gray; font-size: 26rpx; right: 15rpx; position: absolute;">#{{item.floor}}</text>
           	</view>
           	<view style="padding: 10rpx 25rpx 0rpx 25rpx;">
           		<text class="age-content-title" style="word-wrap: break-word;" v-html="item.content"></text>
           		<view style="border-bottom: 1rpx solid gray; margin-top: 25rpx;"></view>
           	</view>
           </view>
        </jp-virtual-list>
    </view>
</template>
<script>
	import ageloading from "../component/loading/age-loading.vue"
	export default {
		components: {
			ageloading
		},
		data() {
			return {
				aid: "",
				page: 1,
				commentList: [],
				// 评论总数
				totalPage:0,
				isshowing: true,
				loadstatus:'more',
				contentText: {
					contentdown: '点击查看更多',
					contentrefresh: '加载中',
					contentnomore: '没有更多'
				}
			}
		},
		methods: {
			// ispulldown 是否是下来刷新
			// true 下拉刷新; false 上拉加载
			loadData(ispulldown) {
					
				if( ispulldown == false ) {
					this.page++
					if(this.loadstatus == 'nomore') {
						return
					}
				} else {
					this.page = 1
				}
				this.loadstatus = 'loading'
				const vm = this
				var url = `https://ageapi.omwjhz.com:18888/v2/comment/${vm.aid}/?page=${vm.page}`
				console.log(url)
				uni.request({
					url:url,
					success(res) {
						console.log(res.data)
						const data = res.data['data']
						
						vm.totalPage = data['pagination']['totalPage']
							
						if(ispulldown) {
							vm.commentList = data['comments']
						} else {
							//concat添加一个数组的全部元素到该数组
							vm.commentList = vm.commentList.concat(data['comments'])
						}
						console.log(vm.commentList)
						if (vm.page == vm.totalPage) {
							vm.loadstatus = 'nomore'
						} else {
							vm.loadstatus = 'more'
						}
						
						uni.stopPullDownRefresh()
						vm.isshowing = false
					},
					fail() {
						uni.showToast({
							title: '数据请求失败！'
						})
						vm.isshowing = false
						uni.stopPullDownRefresh()
					}
				})
			}
		},
		onLoad(option) {
			console.log(option.id)
			this.aid = option.id
		},
		mounted() {
			this.loadData(true)
		},
		onPullDownRefresh() {
			this.loadData(true)
		}
	}
</script>

<style>
	.h100{
	        height: calc(100vh);
	}

</style>